//  this library.
import 'dart:async';

import 'package:flutter/material.dart';
import 'package:flutter_svg/flutter_svg.dart';
import 'package:hktk_app/ienum/practice/ct_enum.dart';
import 'package:hktk_app/ienum/question/question_type_enum.dart';
import 'package:hktk_app/pages/question/diary_page.dart';
import 'package:hktk_app/util/data_util.dart';
import 'package:hktk_app/util/event_bus_util.dart';
import 'package:hktk_app/util/font_util.dart';

import 'package:hktk_app/util/question_util.dart';
import 'package:hktk_app/util/sz_util.dart';
import 'package:hktk_app/util/view_util.dart';

/// 做题测试页面标题
class QuestionTitleWidget extends StatefulWidget {
  /// 总题数
  final int total;

  /// 试题模式，ture-答题，false-背题
  final QuestionTypeEnum type;

  /// 显示标题名称
  final String name;

  /// 题目切换点击方法
  final ValueChanged<QuestionTypeEnum> onTapFunType;

  const QuestionTitleWidget({
    super.key,
    required this.total,
    required this.type,
    required this.name,
    required this.onTapFunType,
  });

  @override
  State createState() => _QuestionTitleWidgetState();
}

class _QuestionTitleWidgetState extends State<QuestionTitleWidget> {
  late BuildContext _context;

  /// 第几题
  late int _num;

  late StreamSubscription<EventQuestionOnPage> _eventOnPage;

  @override
  void initState() {
    super.initState();
    if(dataUtilComm.paperData != null){
      _num = dataUtilComm.paperData!.lastIndex + 1;
    }else{
      _num = 1;
    }
    // 监听相应类型的事件
    _eventOnPage = eventBus.on<EventQuestionOnPage>().listen((event) {
      if (widget.type == event.type) {
        setState(() {
          _num = event.index + 1;
        });
      }
    });
  }

  @override
  void dispose() {
    debugPrint("questionTitleWidget 组件 -> dispose 方法执行 ===> ");
    debugPrint("");
    // 页面销毁
    super.dispose();
    _eventOnPage.cancel();
  }

  @override
  Widget build(BuildContext context) {
    debugPrint("questionTitleWidget 组件 -> build 方法执行 ===> ");
    debugPrint("");
    _context = context;
    return Container(
      decoration: BoxDecoration(
        color: getColorWhite1(szYjms: szUtilComm.szInfo.yjms),
        borderRadius: BorderRadius.only(
          bottomLeft: Radius.circular(20),
          bottomRight: Radius.circular(20),
        ),
        boxShadow: [
          BoxShadow(
            color: colorBlack4,
            offset: Offset(0, 2),
            blurRadius: 8, // 阴影模糊程度
            spreadRadius: 0, // 阴影扩散程度
          )
        ],
      ),
      // child: Container(),
      child: Column(
        children: [
          _titleItem(),
          _tipsItem(),
        ],
      ),
    );
  }

  /// 标题显示
  _titleItem() {
    return SizedBox(
      height: 88,
      child: Stack(
        fit: StackFit.expand,
        children: [
          _typeQuestion(),
          _iconItem(),
        ],
      ),
    );
  }

  /// 答题/背题显示
  _typeQuestion() {
    return Row(
      mainAxisAlignment: MainAxisAlignment.center,
      children: [
        _showType(QuestionTypeEnum.answer),
        _showType(QuestionTypeEnum.memory),
      ],
    );
  }

  /// 显示对应按钮
  _showType(QuestionTypeEnum showType) {
    return GestureDetector(
      onTap: () {
        if (widget.type != showType) {
          debugPrint("questionTitleWidget 组件 -> 你点击了 ${showType.desc} ===> ");
          widget.onTapFunType(showType);
        }
      },
      child: Container(
        width: 120,
        height: 44,
        padding: EdgeInsets.only(bottom: 3),
        decoration: BoxDecoration(
          color: widget.type == showType
              ? getColorBlue1(szYjms: szUtilComm.szInfo.yjms)
              : getColorWhite1(szYjms: szUtilComm.szInfo.yjms),
          borderRadius: BorderRadius.horizontal(
            left: showType == QuestionTypeEnum.answer
                ? Radius.circular(8)
                : Radius.zero,
            right: showType == QuestionTypeEnum.memory
                ? Radius.circular(8)
                : Radius.zero,
          ),
          border: Border.all(
            color: getColorBlue1(szYjms: szUtilComm.szInfo.yjms),
            width: 1,
          ),
        ),
        child: Center(
          child: Text(
            showType.desc,
            style: TextStyle(
              fontSize: 20,
              fontWeight: FontWeight.w400,
              color: widget.type == showType
                  ? colorWhite1
                  : getColorBlack1(szYjms: szUtilComm.szInfo.yjms),
            ),
          ),
        ),
      ),
    );
  }

  /// 显示对应的图标数组
  _iconItem() {
    return Padding(
      padding: EdgeInsets.only(right: 30),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: [
          _iconShowItem(
            svgUrl: "images/back/back.svg",
            size: 36,
            onTapFun: _onTapFunTc,
          ),
          _iconShowKsjl(),
        ],
      ),
    );
  }

  /// 考试记录交卷显示
  _iconShowKsjl() {
    CtEnum rType = dataUtilComm.paperData!.rType;
    if (rType == CtEnum.everyday) {
      return _iconShowItem(
        svgUrl: "images/question/question_ksjl.svg",
        size: 44,
        onTapFun: _onTapFunKsjl,
      );
    } else {
      return SizedBox(
        width: 44,
        height: 44,
      );
    }
  }

  /// 图标具体显示
  _iconShowItem({
    required String svgUrl,
    required double size,
    required Function() onTapFun,
  }) {
    return GestureDetector(
      onTap: onTapFun,
      child: SvgPicture.asset(
        svgUrl,
        width: size,
        height: size,
        color: szUtilComm.szInfo.yjms ? colorWhite1 : null,
      ),
    );
  }

  /// 显示提示组件
  _tipsItem() {
    return Container(
      height: 70,
      padding: EdgeInsets.symmetric(horizontal: 30),
      child: Row(
        mainAxisAlignment: MainAxisAlignment.spaceBetween,
        children: [
          Expanded(
            child: Text(
              widget.name,
              style: FontUtil.fontGrey1(20),
              maxLines: 1,
              overflow: TextOverflow.ellipsis,
            ),
          ),
          Text.rich(TextSpan(
            children: [
              TextSpan(
                  text: _num.toString(),
                  style: FontUtil.fontGrey2(30, fontWeight: FontWeight.w500)),
              TextSpan(
                text: "/${widget.total}",
                style: FontUtil.fontGrey1(26),
              ),
            ],
          )),
        ],
      ),
    );
  }

  /// 考试记录点击方法
  void _onTapFunKsjl() {
    Navigator.pushNamed(context, "/diary");
  }

  /// 退出按钮点击方法
  void _onTapFunTc() {

    questionBackFun(
      context: _context,
      dataModel: dataUtilComm.dataModel,
      paperDataModel: dataUtilComm.paperData!,
    );
  }
}
